<template>
  <div class="app-container">
    <el-form ref="queryFormRef" :inline="true" :model="queryParams" class="demo-form-inline"
      v-hasPermi="['md:supplier:query']">
      <el-form-item label="分类" prop="type">
        <el-select v-model="queryParams.type" clearable filterable placeholder="请选择供应商分类" style="width: 100%;">
          <el-option v-for="item in dict.type.sys_supplier_type" :key="item.value" :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="名称" prop="name">
        <el-input v-model.trim="queryParams.name" :maxlength="50" size="small" placeholder="请输入名称"></el-input>
      </el-form-item>
      <el-form-item label="简称" prop="shortName">
        <el-input v-model.trim="queryParams.shortName" clearable :maxlength="50" size="small"
          placeholder="请输入简称"></el-input>
      </el-form-item>
      <el-form-item label="开发负责人" prop="developPerson">
        <el-select v-model="queryParams.developPerson" allow-create clearable filterable placeholder="请选择开发负责人"
          style="width: 100%;">
          <el-option v-for="item in userList" :key="item.userId" :label="item.userName" :value="item.userName">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" size="mini" icon="el-icon-search" v-hasPermi="['md:supplier:query']"
          @click="searchHandler">查询</el-button>
        <el-button icon="el-icon-refresh-right" size="mini" v-hasPermi="['md:supplier:query']"
          @click="resetForm('queryFormRef')">重置</el-button>
      </el-form-item>
    </el-form>

    <div class="grid-content bg-purple">
      <el-button plain type="primary" icon="el-icon-plus" size="mini" v-hasPermi="['md:supplier:add']"
        @click="openDialog(null)">增加</el-button>
      <!--          <el-button plain type="warning" icon="el-icon-download" size="mini" v-hasPermi="['md:supplier:export']" @click="exportHandler">导出</el-button>-->
      <el-button plain type="info" icon="el-icon-download" size="mini" v-hasPermi="['md:supplier:import']"
        @click="handleImport">导入</el-button>
    </div>

    <el-table ref="tableRef" :data="tableData" v-loading="loading" highlight-current-row max-height="600"
      v-horizontal-scroll="'auto'" style="width: 100%;margin-top: 10px;" @current-change="handleCurrentChange">
      <el-table-column type="index" width="50" align="center" label="序号">
        <template slot-scope="scope">
          <span>{{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}</span>
        </template>
      </el-table-column>
      <el-table-column property="type" label="分类" align="center" width="80" />
      <el-table-column property="name" label="名称" align="center" width="120" />
      <el-table-column property="shortName" label="简称" align="center" width="80" />
      <el-table-column property="taxNumber" label="统一社会信用代码" align="center" width="130" />
      <el-table-column property="address" label="地址" align="center" width="160" />
      <el-table-column property="legalPerson" label="法定代表人" align="center" width="100" />
      <el-table-column property="controllerPerson" label="实际控制人" align="center" width="100" />
      <el-table-column property="bank" label="开户银行" align="center" width="120" />
      <el-table-column property="bankNumber" label="银行账号" align="center" width="120" />
      <el-table-column property="phone" label="电话号码" align="center" width="120" />
      <el-table-column property="taxRate" label="税率" align="center" width="120">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.sys_tax_rate" :value="scope.row.taxRate" />
        </template>
      </el-table-column>
      <el-table-column property="webAddress" label="网址" align="center" width="120" />
      <el-table-column property="startDate" label="合作开始时间" align="center" width="100" />
      <el-table-column property="scaleAdvantage" label="公司规模及优势" align="center" min-width="260" />
      <el-table-column property="developPerson" label="开发负责人" align="center" width="100" />
      <el-table-column property="level" label="供应商评级" align="center" width="100" />
      <el-table-column property="remark" label="备注" align="center" />
      <el-table-column property="createBy" label="创建人" align="center" width="80" />
      <el-table-column property="createTime" label="创建时间" align="center" width="160" sortable />
      <el-table-column label="操作" align="center"
        v-if="$auth.hasPermi('md:supplier:edit') || $auth.hasPermi('md:supplier:remove') || $auth.hasPermi('md:supplier:view')">
        <template slot-scope="scope">
          <el-button type="text" v-if="scope.row.certification" icon="el-icon-view" v-hasPermi="['md:supplier:view']"
            @click="handleView(scope.row)">查看资质</el-button>
          <el-button type="text" icon="el-icon-edit" v-hasPermi="['md:supplier:edit']"
            @click="openDialog(scope.row)">修改</el-button>
          <el-popconfirm confirm-button-text="是" cancel-button-text="否" title="确定删除吗？"
            @confirm="deleteHandler(scope.row)">
            <el-button slot="reference" icon="el-icon-delete" type="text"
              v-hasPermi="['md:supplier:remove']" style="margin-left: 10px">删除</el-button>
          </el-popconfirm>
        </template>
      </el-table-column>
    </el-table>

    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />

    <div>
      <el-tabs>
        <el-tab-pane label="联系人" v-if="$auth.hasPermi('md:supplier:contact:list')">
          <AgentContacts v-if="schoolInfo.id" :school-info="schoolInfo" :type="2" />
        </el-tab-pane>
        <el-tab-pane label="采购信息">
          <!-- v-if="$auth.hasPermi('md:supplier:contact:list')" -->
          <Purchase v-if="schoolInfo.id" :school-info="schoolInfo" :type="2" />
        </el-tab-pane>
        <el-tab-pane label="不良记录">
          <!-- v-if="$auth.hasPermi('md:supplier:contact:list')" -->
          <Bad v-if="schoolInfo.id" :school-info="schoolInfo" :type="2" />
        </el-tab-pane>
      </el-tabs>
    </div>

    <el-dialog :title="dialogTitle === 1 ? '新增' : '修改'" :visible.sync="dialogVisible" width="800px" close-on-click-modal
      :fullscreen="device == 'mobile'">
      <el-form :model="form" :rules="rules" ref="formRef" :label-position="device == 'mobile' ? 'top' : 'right'"
        label-width="120px" class="demo-form">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="分类" prop="type">
              <el-select v-model="form.type" clearable filterable placeholder="请选择供应商分类" style="width: 100%;">
                <el-option v-for="item in dict.type.sys_supplier_type" :key="item.value" :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="名称" prop="name">
              <el-input v-model.trim="form.name" :maxlength="50" placeholder="请输入名称"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="简称" prop="shortName">
              <el-input v-model.trim="form.shortName" :maxlength="50" placeholder="请输入简称"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="合作开始时间" prop="startDate">
              <el-date-picker v-model="form.startDate" type="date" placeholder="选择日期" value-format="yyyy-MM-dd"
                style="width: 100%;" :picker-options="pickerOptions" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="法定代表人" prop="legalPerson">
              <el-input v-model.trim="form.legalPerson" :maxlength="50" placeholder="请输入法定代表人"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="实际控制人" prop="controllerPerson">
              <el-input v-model.trim="form.controllerPerson" :maxlength="50" placeholder="请输入实际控制人"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="device == 'mobile' ? 24 : 12">
            <el-form-item label="地址" prop="address">
              <el-input v-model.trim="form.address" type="textarea" :maxlength="100" placeholder="请输入地址"
                :autosize="{ minRows: 2 }"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="device == 'mobile' ? 24 : 12">
            <el-form-item label="公司规模及优势" prop="scaleAdvantage">
              <el-input v-model.trim="form.scaleAdvantage" type="textarea" :maxlength="100" placeholder="请输入公司规模及优势"
                :autosize="{ minRows: 2 }"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="开发负责人" prop="developPerson">
              <el-select v-model="form.developPerson" allow-create clearable filterable placeholder="请选择招商负责人"
                style="width: 100%;">
                <el-option v-for="item in userList" :key="item.userId" :label="item.userName" :value="item.userName">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="供应商评级" prop="level">
              <el-select v-model="form.level" allow-create clearable filterable placeholder="请选择供应商评级"
                style="width: 100%;">
                <el-option v-for="item in supplierRating" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="device == 'mobile' ? 24 : 12">
            <el-form-item class="cus-form-item" label="统一社会信用代码" prop="taxNumber">
              <span slot="label">统一社会<br v-if="device !== 'mobile'" />信用代码</span>
              <el-input v-model.trim="form.taxNumber" type="textarea" :maxlength="50" placeholder="请输入统一社会信用代码" />
            </el-form-item>
          </el-col>
          <el-col :span="device == 'mobile' ? 24 : 12">
            <el-form-item label="注册地址" prop="registeredAddress">
              <el-input v-model.trim="form.registeredAddress" type="textarea" :maxlength="100" placeholder="请输入注册地址"
                :autosize="{ minRows: 2 }"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="开户银行" prop="bank">
              <el-input v-model.trim="form.bank" :maxlength="100" placeholder="请输入开户银行"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="银行账号" prop="bankNumber">
              <el-input v-model.trim="form.bankNumber" :maxlength="50" placeholder="请输入银行账号"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="device == 'mobile' ? 24 : 12">
            <el-form-item label="电话号码" prop="phone">
              <el-input v-model.trim="form.phone" :maxlength="50" placeholder="请输入电话号码"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="device == 'mobile' ? 24 : 12">
            <el-form-item label="税率" prop="taxRate">
              <el-select v-model="form.taxRate" allow-create clearable filterable placeholder="请选择税率"
                style="width: 100%;">
                <el-option v-for="item in dict.type.sys_tax_rate" :key="item.value" :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="显示排序" prop="orderNum">
          <el-input-number v-model.trim="form.orderNum" :min="0" :step="1" step-strictly style="width: 100%;" />
        </el-form-item>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="网址" prop="webAddress">
              <el-input v-model.trim="form.webAddress" :maxlength="50" placeholder="请输入网址, 没有填无"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="备注" prop="remark">
          <el-input v-model.trim="form.remark" type="textarea" :maxlength="200" placeholder="请输入备注"
            :autosize="{ minRows: 2 }"></el-input>
        </el-form-item>
        <el-form-item label="上传资质">
          <el-upload class="upload-demo" ref="upload" action="#" :limit="1" :on-change="handleChange"
            :on-remove="handleRemove" :file-list="fileList" :auto-upload="false" accept=".pdf">
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">只能上传pdf文件</div>
          </el-upload>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" :loading="uploadLoading" @click="submitForm('formRef')">提交</el-button>
        <el-button @click="dialogVisible = false">取消</el-button>
      </div>
    </el-dialog>

    <!-- 用户导入对话框 -->
    <el-dialog title="导入" :visible.sync="upload.open" width="400px" :fullscreen="device == 'mobile'">
      <el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
        :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
        :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="el-upload__tip text-center" slot="tip">
          <div class="el-upload__tip" slot="tip">
            <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的数据
          </div>
          <span>仅允许导入xls、xlsx格式文件。</span>
          <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
            @click="importTemplate">下载模板</el-link>
        </div>
      </el-upload>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFileForm">确 定</el-button>
        <el-button @click="upload.open = false">取 消</el-button>
      </span>
    </el-dialog>

  </div>
</template>

<script>
import { addDataApi, deleteDataApi, getDataListApi, updateDataApi } from "@/api/crm/md/supplier";
import { uploadImgApi } from "@/api/after/serve";
import { getUserProfile, listUser } from "@/api/system/user";
import AgentContacts from "./agentContacts.vue";
import Purchase from "@/views/erp/purchase";
import Bad from "@/views/erp/bad";
import { getToken } from "@/utils/auth";
import { mapGetters } from "vuex";
import { isFileOfType } from "@/utils";

export default {
  name: 'SupplierView',
  dicts: ['sys_cooperate_intention', 'sys_tax_rate', 'sys_supplier_type'],
  components: {
    AgentContacts,
    Purchase,
    Bad
  },
  data() {
    return {
      uploadLoading: false, // 上传的加载
      env: process.env.VUE_APP_STATIC_API || '',
      // 文件列表
      fileList: [],
      // 记录上一次打开弹窗是修改or增加
      // null 增加
      // 非null 修改
      formId: null,
      // 日期选择框配置
      pickerOptions: {
        disabledDate(time) {
          // 禁止选择今天及今天之后的日期
          return time.getTime() > Date.now();
        }
      },
      // 代理商信息
      schoolInfo: {},
      // 加载动画
      loading: true,
      // 省份数据
      provinceList: [],
      // 弹框标题 1是增加 其他是修改
      dialogTitle: 1,
      // 弹框显示
      dialogVisible: false,
      // 用户导入参数
      // 用户导入参数
      upload: {
        // 是否显示弹出层（用户导入）
        open: false,
        // 弹出层标题（用户导入）
        title: "",
        // 是否禁用上传
        isUploading: false,
        // 是否更新数据
        updateSupport: false,
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + "/erp/supplier/importData"
      },
      // 新增和修改参数
      form: {
        orderNum: null, // 显示排序
        level: "", // 供应商评级
        webAddress: "", // 网址
        address: "", // 地址
        createBy: "", // 用户 *
        createTime: "", // 创建时间 *
        id: null, // id
        intention: "", // 合作意向
        name: "", // 代理商名称 *
        province: "", // 省份 *
        remark: "", // 备注
        shortName: "", // 简称
        updateBy: "", // 更新人
        updateTime: "", // 更新时间
        legalPerson: "", // 法人
        controllerPerson: "", // 实际控制人
        startDate: "", // 合作开始日期
        scaleAdvantage: "", // 公司规模及优势
        chargePerson: "", // 招商负责人
        harmony: "", // 关系融洽度
        taxNumber: "", // 统一社会信用代码
        registeredAddress: "", // 注册地址
        phone: "", // 电话
        bank: "", // 开户银行
        taxRate: "", // 税率
        bankNumber: "", // 银行账号
      },
      // 重点客户下拉数据
      isImportantList: [
        {
          value: 0,
          label: '普通客户'
        },
        {
          value: 1,
          label: '重点客户'
        }
      ],
      // 表单的校验规则
      rules: {
        developPerson: [
          { required: true, message: '请选择开发负责人', trigger: 'blur' }
        ],
        webAddress: [
          { required: true, message: '请填写网址', trigger: 'blur' }
        ],
        name: [
          { required: true, message: '请填写代理商名称', trigger: 'blur' }
        ],
        shortName: [
          { required: true, message: '请填写简称', trigger: 'blur' }
        ],
        taxNumber: [
          { required: true, message: '请填写统一社会信用代码', trigger: 'blur' }
        ],
        address: [
          { required: true, message: '请填写地址', trigger: 'blur' }
        ],
        legalPerson: [
          { required: true, message: '请填写法定代表人', trigger: 'blur' }
        ],
        controllerPerson: [
          { required: true, message: '请填写实际控制人', trigger: 'blur' }
        ],
        scaleAdvantage: [
          { required: true, message: '请填写公司规模及优势', trigger: 'blur' }
        ],
        chargePerson: [
          { required: true, message: '请填写招商负责人', trigger: 'blur' }
        ],
        startDate: [
          { required: true, message: '请填写合作开始时间', trigger: ['blur', 'change'] }
        ],
        // taxRate: [
        //   { required: true, message: '请选择税率', trigger: 'change' }
        // ],
        type: [
          { required: true, message: '请选择供应商分类', trigger: 'change' }
        ],
        province: [
          { required: true, message: '请选择省份', trigger: 'change' }
        ],
        level: [
          { required: true, message: '请选择供应商评级', trigger: 'change' }
        ],
      },
      // 供应商评级
      supplierRating: [
        {
          value: 'A',
          label: 'A'
        },
        {
          value: 'B',
          label: 'B'
        },
        {
          value: 'C',
          label: 'C'
        },
        {
          value: 'D',
          label: 'D'
        },
      ],
      // 表格数据
      tableData: [],
      // 总数条数
      total: 0,
      // 查询参数
      queryParams: {
        shortName: "", // 简称
        developPerson: "", // 开发负责人
        type: "", // 分类
        projectNo: "", // 项目编号
        deviceName: "", // 设备名称
        projectName: "",
        name: "", // 代理商名称 *
        province: "", // 省份 *
        pageNum: 1,
        pageSize: 10,
      },
      // 用户信息
      user: {},
      roleGroup: {},
      postGroup: {},
      userList: [],
    }
  },
  computed: {
    ...mapGetters([
      'device'
    ]),
  },
  watch: {
    'form.isImportant': {
      handler(newV) {
        if (newV !== 1) {
          this.form.basis = null
        }
      }
    },
  },
  created() {
    // this.provinceList = ProvinceData
    this.getList()
    this.getUserinfo()
    this.getUserList()
  },
  activated() {
    this.getList()
  },
  methods: {
    // 查看资质
    handleView(row) {
      window.open(this.env + row.certification)
    },
    // 上传文件
    async uploadImg() {
      const urlList = (this.fileList ?? []).filter(i => !i.raw).map(i => i.url)
      if(urlList && urlList[0]) { return false }
      if(this.fileList.length <= 0) {
        this.form.certification = ""
        return false
      }
      // const list = (this.fileList ?? []).filter(i => i.raw).map((item) => {
      const file = this.fileList[0]
      const formData = new FormData()
      formData.append('file', file.raw)
      const { fileName } = await uploadImgApi(formData)
      //   return uploadImgApi(formData)
      // })

      // const imgList = (await Promise.all(list) ?? []).map(item => item?.fileName ?? "") ?? []
      this.form.certification = fileName ?? "" // [...urlList, ...imgList].join(',')
    },
    // 删除文件
    handleRemove(_, fileList) {
      this.fileList = fileList
    },
    // 选中文件
    handleChange(_, fileList) {
      const file = fileList[0] ?? null

      if (isFileOfType(file.name, ['.pdf'])) {
        this.fileList = fileList
      } else {
        this.$notify.error({
          title: '错误',
          message: '文件选择错误'
        });
        this.fileList = []
      }
    },
    /** 导入按钮操作 */
    handleImport() {
      this.upload.title = "用户导入";
      this.upload.open = true;
    },
    /** 下载模板操作 */
    importTemplate() {
      const a = document.createElement('a')
      a.href = process.env.VUE_APP_BASE_API + '/erp/supplier/importTemplate'
      a.click()
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      this.upload.open = false;
      this.upload.isUploading = false;
      this.$refs.upload.clearFiles();
      this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
      this.getList();
    },
    // 提交上传文件
    submitFileForm() {
      this.$refs.upload.submit();
    },
    // 获取用户列表
    getUserList() {
      listUser({
        pageSize: 500,
        // userId: store.state.user.id,
        // deptId: store.state.user.deptId,
      }).then(response => {
        this.userList = (response.rows ?? []).filter(i => !i.admin)
      }
      );
    },
    // 获取根据list中的value返回label
    getListValue(data, list, value = 'value') {
      let label = ''
      list.map((item) => {
        if (+item[value] === +data) {
          label = item.label
        }
      })
      return label
    },
    // 获取用户信息
    getUserinfo() {
      getUserProfile().then(response => {
        this.user = response.data;
        this.roleGroup = response.roleGroup;
        this.postGroup = response.postGroup;
      });
    },
    // 获取数据
    async getList() {
      this.loading = true
      const res = await getDataListApi(this.queryParams)
      if (res.code === 200) {
        this.tableData = res.rows
        this.total = res.total
      }
      this.loading = false
    },
    // 搜索的回调
    searchHandler() {
      this.queryParams.pageNum = 1
      this.getList()
    },
    // 删除的回调
    async deleteHandler(row) {
      const res = await deleteDataApi({
        id: row.id
      })
      if (res.code === 200) {
        this.$message({
          message: res.msg,
          type: 'success'
        });
        this.getList()
        this.dialogVisible = false
      } else {
        this.$message({
          message: res.msg,
          type: 'error'
        });
      }
    },
    // 打开弹窗
    openDialog(row) {
      if (row) {
        this.formId = row.id
        this.form = { ...row }
        this.fileList = ((row.certification ?? "").split(',') ?? []).filter(i => i).map(item => ({ name: item, url: item }))
        this.dialogTitle = 2
      } else {
        if (this.formId) {
          this.form = { ...this.$options.data().form }
        }

        this.fileList = []
        this.formId = null
        this.dialogTitle = 1
      }
      this.dialogVisible = true
      // this.resetForm('formRef')
      this.$nextTick(() => {
        this.$refs['formRef'].clearValidate();
        // this.resetForm('formRef')
      })
    },
    // 导出的回调
    async exportHandler() {
      this.download('erp/supplier/export', {
        ...this.queryParams,
        userId: this.user.userId,
        deptId: this.user.deptId,
      }, `suppliers_${new Date().getTime()}.xlsx`)
    },
    // 表单提交
    submitForm(formName) {
      this.$refs[formName].validate(async (valid) => {
        if (valid) {
          try {
            this.uploadLoading = true
            await this.uploadImg()
          } catch (error) {
            this.uploadLoading = false
          }
          this.uploadLoading = false
          if (this.dialogTitle === 1) {
            this.addDataHandler()
          } else {
            this.updateDataHandler()
          }
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    // 增加数据的回调
    async addDataHandler() {
      const payload = {
        ...this.form,
        createBy: this.user.nickName,
        updateBy: this.user.nickName,
        userId: this.user.userId,
      }
      const res = await addDataApi(payload)
      if (res.code === 200) {
        this.$message({
          message: res.msg,
          type: 'success'
        });
        this.getList()
        this.formId = -1
        this.dialogVisible = false
        this.fileList = []
      } else {
        this.$message({
          message: res.msg,
          type: 'error'
        });
      }
    },
    // 修改数据的回调
    async updateDataHandler() {
      const payload = {
        ...this.form,
        updateBy: this.user.nickName,
      }
      const res = await updateDataApi(payload)
      if (res.code === 200) {
        this.$message({
          message: res.msg,
          type: 'success'
        });
        this.getList()
        this.dialogVisible = false
        this.fileList = []
      } else {
        this.$message({
          message: res.msg,
          type: 'error'
        });
      }
    },
    // 重置表单
    resetForm(formName) {
      if (this.$refs[formName]) {
        this.$refs[formName].resetFields();
      }
    },
    // 选中当前列
    handleCurrentChange(row) {
      this.schoolInfo = { ...row }
    },
  },
}
</script>

<style scoped lang="scss">
.cus-form-item {
  &::v-deep .el-form-item__label {
    line-height: 26px !important;
  }
}
</style>
